<link  type="text/css" href="https://www.layuicdn.com/layui/css/layui.css" rel="stylesheet"/>
<script type="text/javascript" src="https://www.layuicdn.com/layui/layui.js"></script>
<script type="text/javascript">
    layui.config({
      dir: 'https://www.layuicdn.com/layui/' 
      ,version: false 
      ,debug: false 
      ,base: '' 
    });
</script>



<!-- 框架的组件文档 "https://www.layui.com/doc/modules/tree.html" -->
<div id="test1" style="background-color: #fff;font-size:14px"></div>

<script type="text/javascript">
	layui.use('tree', function(){
		var tree = layui.tree;
		//渲染数据
		var inst1 = tree.render({
			elem: '#test1'  //绑定元素
			,data: [{
				title: '江西' //一级菜单
				,children: [{
					title: '南昌' //二级菜单
					,children: [{
						title: '高新区' //三级菜单
								//…… //以此类推，可无限层级
					}]
				}]
			},{
				title: '陕西' //一级菜单
				,children: [{
					title: '西安' //二级菜单
				}]
			}],
			click: function(obj){
				console.log(obj.data); //得到当前点击的节点数据
				console.log(obj.state); //得到当前节点的展开状态：open、close、normal
				console.log(obj.elem); //得到当前节点元素
			}
		});
	});
</script>